{% raw %}
<script type="text/x-template" id="omesaas-product-sku-default">
      {% for sku in skus %}
      {% assign keyIndex = forloop.index %}
      <div class="cell-item" data-type="key">
      <span class="product-sku-name">{{ sku.name }}</span>
      </div>
      <div class="cell-item" data-type="values">
      <div class="product-sku-values">

        {% for val in sku.value %}
        {% if val.available == 0 %}
        {% assign itemClass = "product-sku-values-item-disable" %}
        {% elsif sku.selected_value == val.value %}
        {% assign itemClass = "product-sku-values-item-active" %}
        {% else %}
        {% assign itemClass = "" %}
        {% endif %}
        <div class="product-sku-values-item {{itemClass}}" data-index="{{ keyIndex }}" data-value='{{ val | json }}'>
          {%- if val.image != "" and sku.isImg -%}
          <img data-src="{{val.image.src}}" data-crop-type="height" data-crop-height="80" src="/theme/default/assets/empty.png"  />
          {%- endif -%}
          {{ val.name }}
        </div>
        {% endfor %}

        
          
      </div>
      </div>
      {% endfor %}
</script>


<script type="text/x-template" id="omesaas-product-sku-select">
      {% for sku in skus %}
      {% assign keyIndex = forloop.index %}
      <div class="cell-item" data-type="key">
      <span class="product-sku-name">{{ sku.name }}</span>
      </div>
      <div class="cell-item" data-type="values">
      <div class="product-sku-values">
        <label class="product-sku-select" >
        <select class="product-sku-unselect">
            {% for val in sku.value %}
            {%- if val.available == 0 -%}
            {% assign itemClass = "disabled" %}
            {% elsif sku.selected_value == val.value %}
            {% assign itemClass = "selected" %}
            {% else %}
            {% assign itemClass = "" %}
            {% endif %}
            <option value='{{val.value}}' {{itemClass}}  data-index="{{ keyIndex }}" data-value='{{ val | json }}'>{{ val.name }}</option>
            {% endfor %}
        </select>
        <div class="mo-edge"></div>
        </label>
      </div>
      </div>
      {% endfor %}
</script>

{% endraw %}

